import { createRouter, RouteRecordRaw, createWebHashHistory, RouteMeta } from 'vue-router';
import HomeView from '../views/HomeView.vue'
export type TypeRouteFirstRecordRaw = {
  label?: string;
  children?: TypeRouteSecondRecordRaw[];
} & RouteRecordRaw;

export interface TypeRouteMeta {
  label?: string;
  icon?: string;
  menu?: boolean;
}
export type TypeRouteSecondRecordRaw = {
  path: string;
  meta: TypeRouteMeta & RouteMeta;
  label?: string;
  icon?: string;
  children?: TypeRouteSecondRecordRaw[];
};
export const routes: TypeRouteFirstRecordRaw[] = [
  {
    path: '/',
    name: 'home',
    component: () => import('../views/HomeView.vue'),
    meta:{
      title:'HOME'
    }
  },
  {
    path: '/apiuse',
    name: 'ApiUse',
    component: () => import('../views/ApiUse.vue'),
    meta:{
      title:'API使用'
    }
  },
  {
    path: '/vantuse',
    name: 'VantUse',
    component: () => import('../views/VantUse.vue'),
    meta:{
      title:'Vant使用'
    }
  },
  {
    path: '/getimg',
    name: 'GetImg',
    component: () => import('../views/GetImg.vue'),
    meta:{
      title:'获取assets里的图片'
    }
  },
  {
    path: '/DefinedProps',
    name: 'DefinedProps',
    component: () => import('../views/DefinedProps.vue'),
    meta:{
      title:'组件传参'
    }
  },
  {
    path: '/RouteUse',
    name: 'RouteUse',
    component: () => import('../views/RouteUse.vue'),
    meta:{
      title:'路由使用'
    }
  },
  {
    path: '/ThisUse',
    name: 'ThisUse',
    component: () => import('../views/ThisUse.vue'),
    meta:{
      title:'获取this'
    }
  },
  {
    path: '/PiniaUse',
    name: 'PiniaUse',
    component: () => import('../views/PiniaUse.vue'),
    meta:{
      title:'Pinia使用'
    }
  },
  {
    path: '/I18nUse',
    name: 'I18nUse',
    component: () => import('../views/I18nUse.vue'),
    meta:{
      title:'I18nUse使用'
    }
  },
]

const router = createRouter({
  history: createWebHashHistory(),
  routes: routes
})
router.beforeEach(to => {
  document.title = to.meta.title as string
})
export default router
